<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>addBrand</title>
</head>
<body>
<div id="app">
    <h3>添加品牌</h3>
    <form method="post" action="" id="addForm">
        品牌名称：<input name="brandName" v-model="brand.brandName"><br>
        企业名称：<input name="companyName" v-model="brand.companyName"><br>
        排序：<input name="ordered" v-model="brand.ordered"><br>
        描述信息：<textarea rows="5" cols="20" name="description" v-model="brand.description"></textarea><br>
        状态：
        <input type="radio" name="status" value="0" v-model="brand.status">禁用
        <input type="radio" name="status" value="1" v-model="brand.status">启用
        <br>
        <input type="button" value="一键添加" @click="submitForm">
    </form>
</div>
<script src="../js/axios-0.18.0.js"></script><!--导入axios.js-->
<script src="../js/vue.js"></script><!--导入vue.js-->
<script>
    new Vue({
        el:"#app",
        data(){
            return {
                //定义数据模型brand，数据类型为Json对象
                brand: {}
            }
        },
        methods:{
            submitForm(){
                let _this = this;
                axios.post("http://localhost:8080/cookiesession_case/addServletJson", _this.brand)
                    .then(resp => {
                        //处理响应
                        if (resp.data === 'success') {
                            alert("添加成功！")
                            location.href = "http://localhost:8080/cookiesession_case/html/brand.html";
                        }
                    });
            }
        }
    })
</script>
<!--<script>
    //快速将表单数据封装为JSON对象
    function add() {
        //获取表单
        let form = document.getElementById("addForm");
        //将表单数据封装成FormData对象
        let formData = new FormData(form);
        //定义请求参数的json对象
        let JsonParams = {};
        //遍历表单数据对象获取键值，封装到json对象中
        formData.forEach((v, k) => {
            JsonParams[k] = v;
        });
        //发送请求，传递参数
        axios.post("http://localhost:8080/cookiesession_case/addServletJson", JsonParams)
            //.then &#45;&#45;》响应成功的回调
            .then(resp => {
                //处理响应
                if (resp.data === 'success') {
                    location.href = "http://localhost:8080/cookiesession_case/html/brand.html";
                }
            })
            //.catch &#45;&#45;》响应失败的回调
            .catch(() => {
                //响应失败的逻辑
                alert("响应失败！")
            });
    }
</script>-->
</body>
</html>